<template>
	<div class="operating-record">
		<div class="operating-record_box" v-for="(item,index) in viewModel" :key="index">
			<div class="number-text"></div>
			<div class="record_box">
				<div class="record_box-list"></div>
				<div class="record_box-circle"></div>
				<div class="record_box-list"></div>
			</div>
			<div class="text_coter"><span>{{item.createTime}} </span>{{item.intro}}</div>
		</div>
	</div>

</template>
<script>
	import ala from 'ala'
	export default {
		props: {
			viewModel: {}
		},
		mounted() {

		}
	}
</script>
<style rel="stylesheet/scss" lang="scss">
	.operating-record {
		padding-left: 70px;

		.operating-record_box {
			display: flex;
			align-items: center;

			.number-text {
				color: #898b96;
				font-size: 12px;
			}

			.text_coter {
				color: #716aca;
				font-size: 12px;

				span {
					color: #666;
				}
			}

			.record_box {
				display: flex;
				flex-direction: column;
				align-items: center;
				padding: 0px 15px;

				.record_box-list {
					width: 2px;
					height: 20px;
					background-color: #E7E9F5;
				}

				.record_box-circle {
					display: inline-block;
					width: 15px;
					height: 15px;
					border-radius: 20px;
					border: 2px solid #36a3f7;
					margin: 5px 0px;
				}
			}
		}
	}
</style>